/*红色*/
li {list-style:none;}
.SonlineBox{ width:108px; font-size:12px;overflow:hidden; z-index:9999;}
.SonlineBox .openTrigger{ width:31px; height:60px; position:absolute; top:0px;  z-index:1; cursor:pointer;  background:#000 url(../images/open.jpg) no-repeat;} 
.SonlineBox .titleBox{ width:108px; height:55px; line-height:35px; background-color:#00AEF0; border-bottom:0px solid #000;}
.SonlineBox .titleBox span{ margin-left:0px; color:#fff; font-size:14px; font-family:Arial, Helvetica, sans-serif; padding:0 0 0 5px;}
.SonlineBox .contentBox{ width:108px; height:auto; border:0px solid #000;  position:absolute; z-index:2;}
.SonlineBox .contentBox .closeTrigger{ width:25px; height:25px; display:block; cursor:pointer;  position:absolute; top:5px;right:5px;-webkit-transition:all 0.8s ease-out;}
.SonlineBox .contentBox .closeTrigger:hover{-webkit-transform:scale(1) rotate(360deg);}
.SonlineBox .contentBox .listBox{overflow:hidden; margin-bottom:0px;}
.SonlineBox .contentBox .listBox .QQList{ display:block;width:100%; height:170px; margin:0 auto; text-align:center; background-color:#EEE;}
.SonlineBox .contentBox .listBox .QQList li{ margin: 0 5% ;padding:0; height:30px;line-height:30px; background-color:#EEE; text-align:center;}
.SonlineBox .contentBox .listBox .QQList a{margin: 0px; padding:0; }
.QQList img {max-width:108px; margin-bottom:0; line-height:0;}

@media(max-width:640px){
		
	.SonlineBox { display:none;}
	
}